﻿
@{
    ViewBag.Title = "单据详情页";
    Layout = "~/Views/Shared/_LayoutPage.cshtml";
}
@model IOA.MES.DataAccess.VModel.VLineMaterialBill

<div id="page"></div>

<script type="text/template" id="tplPage">
    <div class="layui-fluid layui-form">
        <div class="layui-card">
            <div class="layui-card-header">@(Model.CnBillType)单详情</div>
            <div class="layui-card-body">
                <div class="layui-row">
                    <div class="layui-col-xs3 layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.WorkShop">单号：</label>
                        <div class="layui-input-inline">
                            <input type="text" value="@Model.BillNo" class="layui-input" disabled />
                        </div>
                    </div>
                    <div class="layui-col-xs3 layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.WorkShop">车间：</label>
                        <div class="layui-input-inline">
                            <input type="text" value="@Model.WorkshopName" class="layui-input" disabled />
                        </div>
                    </div>
                    <div class="layui-col-xs3 layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.AssemblyLine">流水线：</label>
                        <div class="layui-input-inline">
                            <input type="text" value="@Model.LineName" class="layui-input" disabled />
                        </div>
                    </div>
                    <div class="layui-col-xs3 layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.WorkorderNo">工单号：</label>
                        <div class="layui-input-inline">
                            <input type="text" value="@Model.WorkOrderNo" class="layui-input" disabled />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-body">
                <table id="table" lay-filter="table"></table>
            </div>
        </div>
    </div>
</script>


@section Scripts{
    <script>
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package
            }
        });

        setTimeout(function () {
            initLayui();
        }, 50);

        function initLayui() {
            layui.use(['form', 'layer', 'index', 'laydate', 'table'], function () {
                var layer = layui.layer,
                    table = layui.table,
                    form = layui.form;

                var options = {
                    elem: '#table'
                    , data: @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.Items))
                    , page: false
                    , limit: 1000
                    , cols: [[
                        { type: 'numbers', title: '序号', fixed: 'left', width: 60, align: 'center' }
                        , { field: 'CategoryName', title: '物料分类', width: 100, fixed: 'left' }
                        , { field: 'ProductCode', title: '物料编码', minWidth: 200 }
                        , { field: 'ProductName', title: '物料名称', minWidth: 200 }
                        , { field: 'ProductSpecs', title: '规格', minWidth: 200 }
                        , { field: 'AllocateNo', title: '调拨单号', minWidth: 200 }
                        , { field: 'ProductCompany', title: '生产厂家', minWidth: 200 }
                        , { field: 'BatchNo', title: '批次号', minWidth: 200 }
                        , { field: 'BatchNoBig', title: '托盘号', minWidth: 200 }
                        , { field: 'BatchNoSmall', title: '箱号', minWidth: 200 }
                        , { field: 'Quantity', width: 100, fixed: 'right', title: '发料数量', style: 'color:red;' }
                    ]]
                };
                table.render(options);
            });
        }
    </script>
}
